<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>设备作业设备列表(离线模式)</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui-pull-refresh.css" />
    <link rel="stylesheet" type="text/css" href="./css/comm.css" />
    <link rel="stylesheet" type="text/css" href="./css/headersearch.css" />
    <link rel="stylesheet" type="text/css" href="./css/plandevicetasklist.css" />
    <style>
        .aui-content.contentBox {
            margin-top: 7rem;
        }

        .top-header {
            padding: 10px 10px 5px 10px;
            display: flex;
            justify-content: space-around;
        }

        .list_box_li {
            border-radius: 0;
            box-shadow: unset;
            margin-top: 0;
        }

        .equipment_box {
            height: auto;
            line-height: unset;
            padding: 15px 5px;
        }

        .list-content {
            display: flex;
            justify-content: space-between;
            width: 100%;
        }

        .tip-nostart {
            text-align: center;
            height: 32px;
            line-height: 32px;
            background: #fad0bd;
            color: #fb8753;
            font-size: 13px;
        }

        .equipment-item {
            width: 100%;
            margin-bottom: 10px;
            padding: 10px 16px 16px 16px;
            overflow: hidden;
        }

        .equipment-title {
            width: 100%;
            line-height: 2.5rem;
            height: 2.5rem;
            overflow: hidden;
        }

        .equipment_name {
            width: 74% !important;
            float: left;
            font-size: 0.8rem;
            overflow: hidden;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="aui-content headerBox bgshadow" style="height: auto;">
            <div class="top-header">
                <div v-on:click="onClickStatus(item.ID)" v-for="(item,index) in statusList" class="top-bg-grey"
                    v-bind:class="{'top-bg-blue':form.status==item.ID}">
                    <img v-if="form.status==item.ID" class="rightcontent" src="../image/isroomselects.png" />
                    <div class="text-grey" v-bind:class="{'text-red':index==3}">{{item.Name}}</div>
                    <div class="top-count" v-bind:class="{'text-red':index==3}">{{item.count}}</div>
                </div>
            </div>
            <!-- 搜索 -->
            <div class="aui-searchbar aui-margin-b-5" id="search">
                <div class="aui-searchbar-input aui-border-radius">
                    <i class="icon iconfont icon-sousuo"></i>
                    <input v-model="form.keywords" type="search" placeholder="搜索设备名称/设备编码" id="search-input">
                    <div class="aui-searchbar-clear-btn" style="top:12px">
                        <i class="icon iconfont icon-guanbi"></i>
                    </div>
                </div>
                <div class="aui-searchbar-btn" tapmode></div>
            </div>
        </div>

        <!-- 内容 -->
        <section class="aui-content contentBox">
            <div class="list_box">
                <div class="noinfo noinfo-mt" id="noorder" v-if="lists.length==0">
                    <img src="../image/index/noinfomsg_icon.png" alt="" />
                    <h5><br />没有相关数据哦</h5>
                </div>
                <!-- loop -->
                <div v-if="lists.length>0" v-for="(item,index) in lists" class="list_box_li bo  boxarea mb20">
                    <div class="equipment-item aui-padded-t-5" v-on:click="do_view(item)">
                        <div class="equipment-title">
                            <div class="equipment_name fl aui-ellipsis-1">
                                <i class="icon iconfont icon-yidu text-grey aui-font-size-14"
                                    v-bind:class="{'text-blue':item.TaskStatus==3}"></i>
                                {{item.PatrolName?item.PatrolName:'--'}}
                            </div>
                            <div class=" fr">
                                <div v-if="item.TaskStatus!='3'" class="text-grey">去完成</div>
                                <div v-if="item.TaskStatus=='3'&&item.IsInvalidComplete=='false'" class="text-blue">正常</div>
                                <div v-if="item.TaskStatus=='3'&&item.IsInvalidComplete=='true'" class="text-red">异常</div>
                            </div>
                        </div>
                        <div class="text-grey" style="margin-left: 20px;">
                            <div class="aui-margin-b-5" style="color: #666;">
                                <div class="aui-margin-b-5">设备编码：{{item.PatrolNumber}}</div>
                                <div class="aui-margin-b-5">规格型号：{{item.DeviceModel!='null'?item.DeviceModel:'--'}}
                                </div>
                                <div class="aui-margin-b-5">
                                    存放位置：{{item.DeviceLocationPlace!='undefined'?item.DeviceLocationPlace:'--'}}</div>
                            </div>
                            <div v-if="item.TaskStatus==3">
                                <div class="aui-margin-b-10 aui-margin-t-0" style="border-bottom: 1px dashed #ccc;">
                                </div>
                                <div class="list-content aui-margin-b-5">
                                    <div style="display: flex;">
                                        <img v-if="item.TaskChargeManHeaderImg" :src="item.TaskChargeManHeaderImg"
                                            class="aui-margin-r-10"
                                            style="border-radius: 50%;width: 20px;height: 20px;">
                                        <img v-if="!item.TaskChargeManHeaderImg" src="../image/default.png"
                                            class="aui-margin-r-10"
                                            style="border-radius: 50%;width: 20px;height: 20px;">
                                        {{item.TaskChargeManName?item.TaskChargeManName:'--'}}
                                    </div>
                                    <div v-if="item.TaskCompleteTime"><span v-text="onDealTaskTime(item.TaskCompleteTime)"></span> 完成作业 </div>
                                    <!-- <div>{{item.TaskCompleteTime}} 完成作业</div> -->
                                </div>
                                <div class="aui-margin-b-5"><i
                                        class="icon iconfont icon-addressdizhi aui-font-size-16 text-grey aui-margin-r-10"></i>{{item.GPSLocation?item.GPSLocation:'--'}}
                                </div>
                                <div class="aui-margin-b-5 aui-ellipsis-2"><i
                                        class="icon iconfont icon-renwu aui-font-size-16 text-grey aui-margin-r-10"></i>{{item.TaskCompleteContent?item.TaskCompleteContent:'--'}}
                                </div>
                            </div>
                        </div>
                        <div class="cl"></div>
                    </div>
                </div>
                <div v-if="lists.length>0" class="notodayList">
                    没有更多内容
                </div>
                <!-- loop -->
            </div>
        </section>

    </div>
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/aui-toast.js"></script>
    <script type="text/javascript" src="../script/config.js"></script>
    <script type="text/javascript" src="../script/common.js"></script>
    <script type="text/javascript" src="../script/vue.js"></script>
    <script type="text/javascript" src="../script/aui-pull-refresh.js"></script>
    <script type="text/javascript" src="../script/aui-scroll.js"></script>
    <script type="text/javascript" src="../script/aui-popup.js"></script>
    <script type="text/javascript " src="../script/moment/moment.js"></script>
    <script type="text/javascript" src="js/renwulist_equipment_off_frm.js"></script>
</body>

</html>